<template>
	<view class="bodys">
		<view class="kongs"></view>
		<view class="pics">
			<view class="texs dis dis2">
				<image src="../static/stiati/icon_2.png" mode="aspectFit" class="icon"></image>
				情绪因素占比</view>
			<view class="items">
				<pie></pie>
			</view>
		</view>
		<view class="images">
			<view class="texs dis dis2">
				<image src="../static/stiati/icon_10.png" mode="aspectFit" class="icon"></image>
				情绪指数</view>
			<view class="img dis dis2">
				<block v-for="(item,index) in list" :key="index">
					<view class="image contenr">
						<!-- <image :src="item.url2" mode="aspectFit" class="imgs"></image> -->
						<image :src="item.url2" mode="aspectFit" class="imgs" v-if="index+1==indexRo"></image>
						<!-- <image src="../static/img/biao.png" mode="aspectFit" class="biao" v-if="index+1==indexRo"></image> -->
					</view>
					
				</block>
			</view>
			<view class="texts">{{special}}</view>
		</view>
		<view>
			<list :text1="text1" :text2="text2" :text3="text3" :text4="text4" :text5="text5" :text6="text6" :text7="text7"
			 :text8="text8" :pindex="pindex"></list>
		</view>
	</view>
		
</template>

<script>
	let app = getApp().globalData;
	import btns from '@/components/botn.vue';
	import pie from '@/components/pie.vue';
	import list from '@/components/consequence.vue';
	export default {
		components:{
			btns,
			pie,
			list
		},
		data() {
			return {
				list: [{
					url2: "../static/image/1@2x.png"
				}, {
					
					url2: "../static/image/2@2x.png",
				}, {
					
					url2: "../static/image/3@2x.png"
				}, {
					
					url2: "../static/image/4@2x.png"
				}, {
					
					url2: "../static/image/5@2x.png"
				}],
				text1: '',
				text2: '',
				text3: '',
				text4: '',
				text5: '',
				text6: '',
				text7: '',
				text8: '',
				pindex:0,
				indexRo:-1,
				special:''
			};
		},
		created() {
			let resultData = app.resultData;
			if(resultData.template.indexOf('{special}') !=-1){
				resultData.template = resultData.template.replace(/{special}/g,resultData.special);
			}
			console.log(resultData)
			let value =0;
			let max = 0;
			for(let i=0;i<resultData.zhibiaolist.length;i++){
				value = value+parseInt(resultData.zhibiaolist[i].value);
				max = max + parseInt(resultData.zhibiaolist[i].max);
			};
			let min = (max/5).toFixed(2);
			let index =Math.round(value/min);
			console.log('index',index)
			if(index<1){
				index=1
			}
			this.indexRo=index;
			let text =resultData.special.split('{zhengzhuang}')[0];
			let text1 =(resultData.special.split('{zhengzhuang}')[1]).split('调理建议：')[0];
			this.text1 = text;
			this.text2=resultData.zhengzhuang;
			this.text3=text1;
			this.special = resultData.template;
			
		}
	}
</script>

<style lang="scss" scoped>
	@import "../common/css/flex.css";
	@import "../common/css/index.scss";
	// page{
	// 	background-color: #FBF2D6;
	// }
	.kongs{
		width: 100%;
		height: 56upx;
		
	}
	.pics{
		width: 686upx;
		height: 618upx;
		background: #FFFFFF;
		border-radius: 24upx;
		margin: auto;
		.texs{
			width: 90%;
			height: 120upx;
			font-size: 36upx;
			font-family:$typeface;
			font-weight: 500;
			color: #333333;
			margin-left: 32upx;
			.icon{
				width: 44upx;
				height: 44upx;
				
				margin-right: 10upx;
			}
		}
		.items{
			width: 100%;
			height: 489upx;
		}
	}
	.images{
		width: 686upx;
		height: 431upx;
		background: #FFFFFF;
		border-radius: 24upx;
		margin: auto;
		margin-top: 32upx;
		.texs{
			width: 90%;
			height: 120upx;
			font-size: 36upx;
			font-family:$typeface;
			font-weight: 500;
			color: #333333;
			margin-left: 32upx;
			.icon{
				width: 44upx;
				height: 44upx;
				// margin-left: 32upx;
				margin-right: 10upx;
			}
		}
		.img{
			width: 616upx;
			height: 142upx;
			margin: auto;
			// background-color: #F8F8F8;
			border-radius: 10upx;
			.image{
				width: 616upx;
				height: 142upx;
				.imgs{
					width: 616upx;
					height: 142upx;
				}
				// .biao{
				// 	position: absolute;
				// 	bottom: -30upx;
				// 	width: 21upx;
				// 	height: 26upx;
				// }
			}
		}
		.texts{
			width: 598upx;
			height: 80upx;
			margin: 42upx 32upx;
			font-size: 28upx;
			font-family: $typeface1;
			font-weight: 400;
			color: #666666;
		}
		
	}

</style>
